.container {
  height: 100vh;

  .cityLetter {
    position: fixed;
    right: 5rpx;
    top: 180rpx;
    width: 30rpx;
    z-index: 100;

    view {
      display: block;
      width: 30rpx;
      text-align: center;
      height: 35rpx;
      line-height: 35rpx;
      font-size: 22rpx;
      transition: ease 0.3s;
      -webkit-transition: ease 0.3s;
    }
  }

  .autoLocation {
    justify-content: space-between;
    width: calc(100% - 40rpx);
    background: rgba(250, 250, 250, 0.5);
    padding: 20rpx 20rpx;

    .text {
      font-size: 32rpx;
      margin-right: 10rpx;
      color: #000;
      font-weight: bold;
    }
  }

  .scrollView {
    // height: calc(100vh - 160rpx);
    height: 100%;

    .hotCity {
      padding: 20rpx;

      .hotCityTitle {
        padding: 0rpx 0rpx;

        .text {
          margin-right: 10rpx;
          font-size: 32rpx;
          color: #000;
          font-weight: bold;
        }
      }

      .hotCityList {
        padding: 20rpx 0 0 0;
        flex-wrap: wrap !important;
        border-radius: 12rpx;

        text {
          width: 190rpx;
          display: inline-block;
          text-align: center;
          background: #fff;
          font-size: 26rpx;
          margin: 10rpx;
          padding: 18rpx 10rpx;
          color: #000;
          border: 1rpx solid #999;
          border-radius: 12rpx;
        }
      }
    }

    .cityList {
      padding: 0px 40rpx 0 0rpx;

      .letter {
        font-size: 28rpx;
        border-bottom: 1px solid #f7f7f7;
        padding: 10rpx 10rpx 10rpx 24rpx;
        color: #000;
        background-color: #eee;
      }

      .cityLine {
        margin: 0 0 0 20rpx;

        text {
          display: block;
          padding: 12rpx 10rpx;
          font-size: 30rpx;
          color: #666;
          border-bottom: #eee solid 1rpx;
          // &:nth-child(even) {
          //   background-color: rgba(200, 200, 200, 0.12);
          // }
        }
      }
    }
  }

  .clickLatter {
    font-size: 30rpx !important;
  }

  .jcsb {
    justify-content: space-between;
  }

  .u_flex {
    display: flex;
  }
}
